<template>
  <view class="container">
		<view class="topText">
			<text style="font-size: 36rpx;font-family: Source Han Sans CN;
				font-weight: bold;color: #333333;"
			>修改密码</text>
			<text style="font-size: 26rpx;font-family: Source Han Sans CN;
			font-weight: 500;color: #04082B;margin-top: 22rpx;">为了您的账号安全,请先验证旧密码</text>
		</view>
		<view class="bottomInput">
			<view class="passwordInpt">
				<uni-easyinput maxlength="10" type="password" v-model="oldPassword" placeholder="请输入旧密码"></uni-easyinput>
				<uni-easyinput maxlength="10" type="password" v-model="newPassword" placeholder="请输入新密码"></uni-easyinput>
				<uni-easyinput maxlength="10" type="password" v-model="confirmPassword" placeholder="请再次输入新密码"></uni-easyinput>
			</view>
			<view class="Btn">
				<button class="inputBtn" @click="checkPassword">确定</button>
			</view>
		</view>
  </view>
</template>

<script>
	import {updateUserPwd} from '@/api/system/user.js'
	import cookie from '../../../cookie.js'
	
  export default {
    data() {
      return {
				username:cookie.get('username'),
        oldPassword: '',
				newPassword: '',
				confirmPassword: ''
      }
    },
    methods: {
      checkPassword() {
        if (this.oldPassword === '' || this.newPassword === '' || this.confirmPassword === '') {
          uni.showModal({
             title: '提示',
             content: '密码不能为空，请重新正确输入',
             showCancel: false,
             success: () => {
               this.newPassword = ''; // 清空新密码输入框
               this.confirmPassword = ''; // 清空确认密码输入框
               this.oldPassword = '';  // 清空旧密码
              }
          });
        } else if (this.newPassword !== this.confirmPassword) {
            uni.showModal({
              title: '提示',
              content: '密码不一致，请重新输入',
              showCancel: false,
							success: () => {
                 this.newPassword = ''; // 清空新密码输入框
                 this.confirmPassword = ''; // 清空确认密码输入框
              }
            });
        } else {
             // 执行提交逻辑
             this.submit();
        }
			},
      submit() {
				// 调用实际的提交逻辑
				updateUserPwd(this.username,this.oldPassword, this.newPassword).then(response => {
					console.log('提交成功', response);
				}).catch(error => {
					console.error('提交失败', error);
				});
      }
  
    }
  }
</script>

<style lang="scss">
*{
	margin: 0;
	padding: 0;
}
 page{
	 background: #F5F5F5;
 }
.container{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.topText{
	width: 540rpx;
	// height: 100rpx;
	//background-color: sandybrown;
	display: flex;
	flex-direction: column;
	margin-top: 38rpx;
}
.bottomInput{
	width: 540rpx;
	height: 627rpx;
	margin-top: 92rpx;
	//background-color: darkcyan;
}
.passwordInpt{
	width: 540rpx;
	height: 277rpx;
	display: flex;
	flex-direction: column;
	justify-content: center;
	//background-color: peachpuff;
}
.Btn{
	width: 540rpx;
	height: 350rpx;
	display: flex;
	justify-content: center;
	align-items: flex-end;
}
.inputBtn{
	width: 540rpx;
	height: 72rpx;
	background: linear-gradient(-90deg, #0F174F, #3C4587);
	box-shadow: 0rpx 3rpx 7rpx 0rpx rgba(22,33,135,0.5);
	border-radius: 36rpx;
	font-size: 32rpx;
	font-family: Source Han Sans CN;
	font-weight: 500;
	color: #FFFFFF;
	display: flex;
	justify-content: center;
	align-items: center;
}
// .xgmmInput{
// 	width: 540rpx;
// 	height: 69rpx;
// 	background: #FFFFFF;
// 	box-shadow: 0rpx 5rpx 6rpx 0rpx rgba(22,33,135,0.08);
// 	border-radius: 12rpx;
// 	font-size: 22rpx;
// 	font-family: Source Han Sans CN;
// 	font-weight: 400;
// 	color: #686868;
// }
// .xgmmBtn{
// 	width: 540rpx;
// 	height: 72rpx;
// 	background: linear-gradient(-90deg, #0F174F, #3C4587);
// 	box-shadow: 0rpx 3rpx 7rpx 0rpx rgba(22,33,135,0.5);
// 	border-radius: 36rpx;
// 	margin-top: 200rpx;
// 	font-size: 32rpx;
// 	font-family: Source Han Sans CN;
// 	font-weight: 500;
// 	color: #FFFFFF;
// 	display: flex;
// 	justify-content: center;
// 	align-items: center;
// }
</style>
